let oAll = document.querySelectorAll('.item-class-id');
console.log(oAll[0]);
let cat_one_id = oAll[0].innerHTML;
console.log(cat_one_id);
let line = 8;

setPage(3,cat_one_id,'.list1');
setPage2(1,cat_one_id,'.list2');

function setPage(page,a,b,val){
    const p = new Promise(function(f,r){
        $.ajax({
        url:'../server/goods_list.php',
        type:'get',
        data:{cat_one_id:`${a}`,page:page,line:line},
        dataType:'json',
        success:f,
        error:r,
        })
    })
    p.then(function(res){
        console.log(res);
        let str = '';
        let str1 = '';
        res.data.forEach(item=>{
            str +=`<li><a href="./list.html?cat_one_id=cat_one_id">${item.cat_three_id}</a></li>`;
        })
        console.log(res.data[0]);
        str1 +=`
        
        <div class="l-top">
            <div class="top-l">
                <img src="${res.data[0].goods_big_logo}" alt="">
            </div>
            <div class="top-r">
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[1].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[1].goods_big_logo}" alt="">
                    </div>
                </div>
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[2].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[2].goods_big_logo}" alt="">
                    </div>
                </div>
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[3].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[3].goods_big_logo}" alt="">
                    </div>
                </div>
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[4].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[4].goods_big_logo}" alt="">
                    </div>
                </div>
            </div>
        </div>
        <div class="l-btm">
            <div class="btm-img">
                <img src="${res.data[5].goods_big_logo}" alt="">
            </div>
            <div class="btm-img">
                <img src="${res.data[6].goods_big_logo}" alt="">
            </div>
            <div class="btm-img">
                <img src="${res.data[7].goods_big_logo}" alt="">
            </div>
        </div>
        
            `;
        $(val).html(str);
        $(b).html(str1);
        console.log(str);

    })
}


function setPage2(page,a,b){
    const p = new Promise(function(f,r){
        $.ajax({
        url:'../server/goods_list.php',
        type:'get',
        data:{cat_one_id:`${a}`,page:page,line:line},
        dataType:'json',
        success:f,
        error:r,
        })
    })
    p.then(function(res){
        console.log(res);
        let str = '';
        let str1 = '';
        console.log(res.data[0]);
        str1 +=`
        
        <div class="l-top">
            <div class="top-l">
                <img src="${res.data[0].goods_big_logo}" alt="">
            </div>
            <div class="top-r">
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[1].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[1].goods_big_logo}" alt="">
                    </div>
                </div>
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[2].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[2].goods_big_logo}" alt="">
                    </div>
                </div>
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[3].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[3].goods_big_logo}" alt="">
                    </div>
                </div>
                <div class="r">
                    <div class="text">
                        <p class="pp">${res.data[4].goods_name}</p>
                    </div>
                    <div class="img">
                        <img src="${res.data[4].goods_big_logo}" alt="">
                    </div>
                </div>
            </div>
        </div>
        <div class="l-btm">
            <div class="btm-img">
                <img src="${res.data[5].goods_big_logo}" alt="">
            </div>
            <div class="btm-img">
                <img src="${res.data[6].goods_big_logo}" alt="">
            </div>
            <div class="btm-img">
                <img src="${res.data[7].goods_big_logo}" alt="">
            </div>
        </div>
        
            `;
        $(b).html(str1);

    })
}